<template>
 <div>
    <el-card>
        <div class="v1">{{ v1 }}<svg t="1696522443856" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7920" width="16" height="16"><path d="M512 96c-229.76 0-416 186.24-416 416s186.24 416 416 416 416-186.24 416-416-186.24-416-416-416zM577.248 665.056c-31.392 47.136-63.328 83.456-117.056 83.456-36.672-5.984-51.744-32.256-43.808-59.04l69.12-228.928c1.696-5.6-1.12-11.584-6.24-13.408-5.088-1.792-15.072 4.832-23.712 14.304l-41.792 50.272c-1.12-8.448-0.128-22.4-0.128-28.032 31.392-47.136 82.976-84.32 117.952-84.32 33.248 3.392 48.992 29.984 43.2 59.2l-69.6 230.048c-0.928 5.184 1.824 10.464 6.528 12.128 5.12 1.792 15.872-4.832 24.544-14.304l41.76-50.24c1.12 8.448-0.768 23.232-0.768 28.864zM567.936 366.048c-26.432 0-47.872-19.264-47.872-47.616s21.44-47.584 47.872-47.584 47.872 19.264 47.872 47.584c0 28.384-21.44 47.616-47.872 47.616z" p-id="7921" fill="#8a8a8a"></path></svg></div>
        <div class="v2">{{ v2 }}</div>
        <div class="v3">
            <slot name="v3"></slot>
        </div>
        <hr>
        <div class="v4">
            <slot name="v4"></slot>
        </div>
    </el-card>
 </div>
</template>

<script>
export default {
    name: 'detail',
    data(){
        return {
         }
    },
    props:["v1","v2"]
}
</script>

<style>
.v1{
    color: rgb(141, 143, 143);
    font-size: 15px;
    display: flex;
    justify-content: space-between;
}

.v2{
    font-size: 30px;
    margin: 5px 0px;
}

.v1 .icon{
    width: 20px;
    height: 20px;
    position: relative;
    top: 1px;
}

.v3{
    height: 40px;
}
.v4{
    font-size: 14px;
}
.v4 div{
    height: 7px;
}
</style>
